<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<title>新增页面</title>
	<link rel="stylesheet" href="../../../component/pear/css/pear.css" />
	<style>
		.pear-container{background-color:white;}
		body{margin: 10px;}
	</style>
</head>

<body>
	<form class="layui-form" action="">
        <div class="mainBox">
            <div class="main-container">
				<div class="layui-form-item">

					<div class="layui-row">
						<div class="layui-col-xs6">
							<label class="layui-form-label">类型</label>
							<div class="layui-input-block">
								<input type="radio" name="type" value="1" title="菜单" checked>
								<input type="radio" name="type" value="2" title="接口">
							</div>
							
						</div>
						<div class="layui-col-xs6">
							<label class="layui-form-label">状态</label>
							<div class="layui-input-block">
								<input type="radio" name="status" value="1" title="可用" checked>
								<input type="radio" name="status" value="0" title="禁用">
							</div>
						</div>
					</div>
					
				</div>
				<div class="layui-form-item">
					
					<div class="layui-row">
						<div class="layui-col-xs6">

							<label for="" class="layui-form-label">权限名称</label>
							<div class="layui-input-block">
								<input type="text" id="name" maxlength="16" name="name"  lay-verify="required" placeholder="名称" class="layui-input" >
							</div>
						</div>
						
						<div class="layui-col-xs6">

							<label class="layui-form-label">所属上级</label>
							<div class="layui-input-block">
								<div class="layui-form-select downpanel">
									<div class="layui-select-title">
										<input id="parent_name" type="text" placeholder="空为默认" value="" class="layui-input" disabled>
										<input id="pid" name="pid" type="hidden" value="0">
										<i class="layui-edge"></i>
									</div>
									<dl class="layui-anim layui-anim-upbit">
										<dd>
											<div id="leamus_tree" class="demo-tree-more"></div>
										</dd>
									</dl>
								</div>
							</div>
						</div>
					</div>
				</div>
				
					
				<div class="layui-form-item">

					<div class="layui-row">
						<div class="layui-col-xs6">
							<label class="layui-form-label">API地址</label>
							<div class="layui-input-block">
								<input type="text" id="api_path" name="api_path" placeholder="请输入API地址" class="layui-input">
							</div>
						</div>
						<div class="layui-col-xs6">
							<label class="layui-form-label">方法</label>
							<div class="layui-input-block">
								<input name="methods" placeholder="方法" class="layui-input" id="leamus_methods">
							</div>
						</div>
					</div>
					
				</div>
				
				<div class="layui-form-item">

					<div class="layui-row">
						<div class="layui-col-xs6">
							<label class="layui-form-label">菜单地址</label>
							<div class="layui-input-block">
								<input id="menu_path" type="text" name="menu_path" placeholder="请输入菜单地址" class="layui-input">
							</div>
						</div>
						<div class="layui-col-xs6">
							<label class="layui-form-label">显示</label>
							<div class="layui-input-block">
								<input type="radio" name="show" value="1" title="显示" checked>
								<input type="radio" name="show" value="0" title="隐藏">
							</div>
						</div>
					</div>
					
				</div>

				<div class="layui-form-item">
					
					<div class="layui-row">
						<div class="layui-col-xs6">

							<label for="" class="layui-form-label">图标</label>
							<div class="layui-input-block">
								<div class="layui-input-inline">
									<input type="text" id="iconPicker2" name="icon" value="layui-icon-face-smile" lay-filter="iconPicker2" class="hide">
								</div>
								<div class="layui-input-block" style="position:absolute;">
									<span class="pear-btn" id="clear">清空</span>
								</div>
							</div>
						</div>
						<div class="layui-col-xs6">
							<label for="" class="layui-form-label">排序</label>
							<div class="layui-input-block">
								<input id="sort" type="number" name="sort" value="10" lay-verify="required" placeholder="排序权重" class="layui-input" >
							</div>
						</div>
					</div>
				</div>
				
            </div>
        </div>
			
		<!-- <div class="layui-form-item"> -->
		<div class="bottom">
			<div class="button-container">
				<button type="submit" class="layui-btn layui-btn-normal layui-btn-sm" lay-submit="" lay-filter="save">
					<i class="layui-icon layui-icon-ok"></i>
					提交
				</button>
				<button type="reset" class="layui-btn layui-btn-primary layui-btn-sm">
					<i class="layui-icon layui-icon-refresh"></i>
					重置
				</button>
			</div>
		</div>
	</form>



	<script src="../../../component/layui/layui.js"></script>
	<script src="../../../component/pear/pear.js"></script>
	<script src="../../../lms/base64.js"></script>
	<!-- <script src="../../lms/md5.js"></script> -->
	<script src="../../../lms/common.js"></script>
	<script src="../../../lms/config.js"></script>



	<script>
		//鹰：
		if(!checkLogin()) {
			location.href = lms_config.base_path + "/login.html";
		}



		layui.use(['form','element','iconPicker','jquery', 'tree', 'dropdown'], function() {
			var form = layui.form;
			var element = layui.element;
			var iconPicker= layui.iconPicker;
			var $ = layui.jquery;
			
			var tree= layui.tree;
			var dropdown= layui.dropdown;
			
			dropdown.render({
				elem: '#leamus_methods'
				,data: [{
					title: 'POST'
					,id: 1
				},{
					title: 'GET'
					,id: 2
				},{
					title: 'PUT'
					,id: 3
				},{
					title: 'DELETE'
					,id: 4
				}]
				,click: function(obj){
					this.elem.val(obj.title);
				}
				,style: 'width: 235px;'
			});
			


			let arrMenus = fMakeMenu(getUserInfo().rules);
			arrMenus.unshift({
				"id": 0,
				"title": "顶层",
			});
				//仅节点左侧图标控制收缩
			tree.render({
				elem: '#leamus_tree'
				,onlyIconControl: true  //是否仅允许节点左侧图标控制展开收缩
				,click: function(obj){
					//layer.msg(JSON.stringify(obj.data));
					//console.log(obj.data); //得到当前点击的节点数据
					$("#parent_name").val(obj.data.title);
					$("#pid").val(obj.data.id);
				}
				,data: arrMenus

			});
			//下拉交互显示
			$(".downpanel").on("click", ".layui-select-title", function (e) {
				$(".downpanel").not($(this).parents(".downpanel")).removeClass("layui-form-selected");
				$(this).parents(".downpanel").toggleClass("layui-form-selected");
				layui.stope(e);
			}).on("click", "dl i", function (e) {
				layui.stope(e);
			});
			$(document).on("click", function (e) {
				$(".downpanel").removeClass("layui-form-selected");
			});
			


			iconPicker.render({
				elem: '#iconPicker2',
				type: 'fontClass',
				style: 'color: #5FB878;'
				,placeholder: ''
				,isSplit: true
				,page: false
				//,limit: 5
				,search: true
				,click: function (data) {
				},
				ready: function(d) {
				}
			});
			$('#clear').click(function() {
				iconPicker.checkIcon('iconPicker2', "layui-icon-face-smile");
				//$('#iconPicker2').attr("value","");
				//$('#iconPicker2').attr("title","");
				//$('.layui-iconpicker-main').children("i").attr("class","layui-icon layui-icon-face-smile");
				//$('.layui-iconpicker-main').children("span").remove();
			});


			let method = 'POST';
			if(getQueryString('operation') === 'edit') {
				method = 'PUT';
				
				/*$.ajax({
					url: lms_config.api_url + "/adminapi/v1/setting/Permission/" + getQueryString('id'),
					type: 'GET',
					headers: {Authorization: getUserInfo()["token"]},
					contentType: 'application/json',
					//data: JSON.stringify(data.field),
					dataType: 'json',

					success: function(ret){
						if(ret && ret.code==0) {
							layer.msg(ret.msg, {icon:1,time:1000}, function() {
								parent.layer.close(parent.layer.getFrameIndex(window.name));//关闭当前页
								
								parent.refresh();
								//parent.layui.table.reload("data-table");
								///top.location.reload();
								///parent.location.reload();
							});
						}
						else {
							layer.msg(ret.msg, {
								icon:2,
								//icon: 5,
								time:1000
							});
							return false;
						}
					},
					error: function (ret) {
						console.error(ret);
						alert("出错" + ret.status + "：" + ret.responseText);
					}, //表示如果请求响应出现错误，会执行的回调函数
				});*/

				// console.log($('[name=name]'))
				// console.log(getQueryString('name'))
				// console.log(decodeURI(getQueryString('name')))
				$('[name=type]').each(function(i,item){
					if($(item).val() == getQueryString('type')){
						$(item).prop('checked',true);
					}
					else
						$(item).prop('checked',false);
				});
				$('[name=status]').each(function(i,item){
					if($(item).val() == getQueryString('status')){
						$(item).prop('checked',true);
					}
					else
						$(item).prop('checked',false);
				});
				$('[name=show]').each(function(i,item){
					if($(item).val() == getQueryString('show')){
						$(item).prop('checked',true);
					}
					else
						$(item).prop('checked',false);
				});
				//$('#name').attr('value', decodeURI(getQueryString('name')));
				$('#name').attr("value", decodeURI(getQueryString('name')));
				//$('#parent_name').attr("value", decodeURI(getQueryString('parent_name')));
				$('#pid').attr("value", (getQueryString('pid')));
				$('#api_path').attr("value", (getQueryString('api_path')));
				$('#leamus_methods').attr("value", (getQueryString('methods')));
				$('#menu_path').attr("value", (getQueryString('menu_path')));
				//$('#iconPicker2').attr("value", (getQueryString('icon')));
				$('#sort').attr("value", (getQueryString('sort')));
				iconPicker.checkIcon('iconPicker2', getQueryString('icon'));
				
				form.render();
			}


			form.on('submit(save)', function(data){
				// if(data.field.icon){
				// 	data.field.icon = 'layui-icon ' + data.field.icon;
				// }
				//console.log(lms_config.api_url + "/adminapi/v1/setting/Permission")
				//console.log(data.field)
				$.ajax({
					url: lms_config.api_url + "/adminapi/v1/setting/Permission" + (method === 'PUT' ? '/' + getQueryString('id') : ''),
					type: method,
					headers: {Authorization: getUserInfo()["token"]},
					contentType: 'application/json',
					data: JSON.stringify(data.field),
					dataType: 'json',

					success: function(ret){
						if(ret && ret.code == 0) {
							layer.msg(ret.msg, {icon:1,time:1000}, function() {
								parent.layer.close(parent.layer.getFrameIndex(window.name));//关闭当前页
								
								parent.refresh();
								//parent.layui.table.reload("data-table");
								///top.location.reload();
								///parent.location.reload();
							});
						}
						else {
							layer.msg(ret.msg, {
								icon:2,
								//icon: 5,
								time:1000
							});
							return false;
						}
					},
					error: function (ret) {
						console.error(ret);
						alert("出错" + ret.status + "：" + ret.responseText);
					}, //表示如果请求响应出现错误，会执行的回调函数
				});
				return false;
			});
		});
	</script>
</body>
</html>
